const { src, dest, series, parallel } = require('gulp');
// const pug = require('gulp-pug');
const less = require('gulp-less');
const minifyCSS = require('gulp-csso');
const concat = require('gulp-concat');
const webserver = require('gulp-webserver');
const bodyparser = require('body-parser')
const gulpbabel = require('gulp-babel')
const gulphtml = require('gulp-html')
const htmlmin = require('gulp-htmlmin')
const sass = require('gulp-sass'); // 编译scss css
// const mincss = require('gulp-clean-css') /

function html() {
  return src('src/*.html')
    .pipe(htmlmin())
    .pipe(dest('dist/'))
}

function cssInSass() {
  return src('src/css/*.scss')
    .pipe(sass()) // 编译sass
    .pipe(mincss()) // 压缩css
    .pipe(dest('dist/style'))  // 输出到dist
}

function babel() {
  return src('src/js/*.js')
    .pipe(gulpbabel({
      presets: ['@babel/env']
    }))
    .pipe(dest('dist'))
}

function server() {
  return src('src')
    .pipe(webserver({
      livereload: true,
      // directoryListing: true,
      open: true,
      middleware: [
        bodyparser.urlencoded(),
        (req, res, next) => {
          console.log(req.method)
          console.log(req.url)
          next()
        }
      ]
    }));
}

function css() {
  return src('src/css/*.less')
    .pipe(less())
    .pipe(minifyCSS())
    .pipe(dest('dist/css'))
}

function js() {
  return src('src/js/*.js', { sourcemaps: true })
    .pipe(concat('all.js'))
    .pipe(dest('dist/js', { sourcemaps: true }))
}


module.exports = {
  html,
  css,
  js
}
// exports.html = html;
// exports.js = js;
// exports.cssInSass = cssInSass;
// exports.css = css;
// // exports.server = server;
// // exports.babel = babel;
// exports.build = series(css, babel, server);

// exports.default = parallel(html, css, js);